<template>
  <div>
      商品列表界面
      <table border="1">
          <tr>
              <th>商品名称</th>
              <th>商品价格</th>
              <th>查看详情</th>
          </tr>
          <tr v-for="(item,index) in list" :key="index">
              <td>{{item.title}}</td>
              <td>{{item.price}}</td>
              <td>
                  <router-link :to="'/detail?name='+item.name">进入详情</router-link>
              </td>
          </tr>
          
      </table>
  </div>
</template>

<script>
export default {
    data () {
        return {
            list: [
                {
                    title: '手机壳',
                    price: 39,
                    name: 'shoujike'
                },
                {
                    title: '玻璃杯',
                    price: 9.9,
                    name: 'bolibei'
                },
                {
                    title: '手机',
                    price: '3888',
                    name: 'shouji'
                },
                {
                    title: '耳机',
                    price: '1888',
                    name: 'erji'
                }
            ]
        }
    }
}
</script>

<style>

</style>